import RoleQuery from "../../components/permission/RoleQuery";
import {useEffect, useState} from "react";
import {message} from "antd";
import RequestUtils from "../../utils/RequestUtils";
import Apis from "../../configs/Apis";
import RoleList from "../../components/permission/RoleList";
import RoleWriteModal from "../../components/permission/RoleWriteModal";

const Role = () => {
    const [messageApi, contextHolder] = message.useMessage();

    // 分页查询条件
    const [pageQueryParam, setPageQueryParam] = useState({
        pageNum: 1,
        pageSize: 10,
        roleName: ""
    })

    // 分页查询角色返回信息
    const [pageQueryRolesResp, setPageQueryRolesResp] = useState({
        total: 0, //数据总数
        pageCount: 1, //数据总页数
        records: [] //角色列表
    });

    // 角色写操作Modal参数
    const [roleWriteModalParam, setRoleWriteModalParam] = useState({
        visible: false, //是否打开,
        isEdit: false, //是否是编辑 (true为新增)
        roleInfo: {} //角色信息
    });

    useEffect(() => {
        // 打开页面, 自动分页查询
        doPageQuerySysRoles();
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, []);

    /**
     * 分页查询角色
     * @param param
     */
    const doPageQuerySysRoles = (param) => {

        // 若传了参数, 就用参数里的条件查询, 若没有传参, 则用当前页面的查询条件
        const pageQueryReq = param ? {
            pageNum: param.pageNum,
            pageSize: param.pageSize,
            roleName: param.roleName
        } : {
            pageNum: pageQueryParam.pageNum,
            pageSize: pageQueryParam.pageSize,
            roleName: pageQueryParam.roleName
        }

        RequestUtils.post(Apis.permission.pageQueryRole, {
            pageNum: pageQueryReq.pageNum,
            pageSize: pageQueryReq.pageSize,
            roleName: pageQueryReq.roleName
        }).then(res => {
            setPageQueryRolesResp({
                total: res.total,
                pageCount: res.pageCount,
                records: res.records
            })
        }).catch(err => {
            messageApi.error("查询角色失败: ", err);
        })
    }

    /**
     * 关闭角色写操作modal
     */
    const closeRoleWriteModal = () => {
        setRoleWriteModalParam({
            visible: false,
            isEdit: false,
            roleInfo: {}
        })
    }

    /**
     * 新增角色
     */
    const doAddOrEditRole = () => {
        roleWriteModalParam.isEdit ?
            RequestUtils.post(Apis.permission.editRole, {
                roleId: roleWriteModalParam.roleInfo.roleId,
                roleName: roleWriteModalParam.roleInfo.roleName,
                roleDescription: roleWriteModalParam.roleInfo.roleDescription
            }).then(res => {
                doPageQuerySysRoles();
                closeRoleWriteModal();
                messageApi.success("编辑成功")
            }).catch(err => {
                message.error(err.message)
            })
            :
            RequestUtils.post(Apis.permission.addRole, {
                roleName: roleWriteModalParam.roleInfo.roleName,
                roleDescription: roleWriteModalParam.roleInfo.roleDescription
            }).then(res => {
                doPageQuerySysRoles();
                closeRoleWriteModal();
                messageApi.success("添加成功")
            }).catch(err => {
                messageApi.error(err.message)
            })
    }

    /**
     * 删除角色
     * @param roleId 角色id
     */
    const doDeleteRole = (roleId) => {
        RequestUtils.post(Apis.permission.deleteRoleById, {
            id: roleId
        }).then(res => {
            doPageQuerySysRoles();
            messageApi.success("删除成功")
        }).catch(err => {
            messageApi.error(err.message)
        })
    }

    return (
        <div>
            {contextHolder}

            {/* 页面操作部分 (包括查询、新增操作) */}
            <RoleQuery
                messageApi={messageApi}
                doPageQuerySysRoles={doPageQuerySysRoles}
                pageQueryParam={pageQueryParam}
                setPageQueryParam={setPageQueryParam}
                setRoleWriteModalParam={setRoleWriteModalParam}
            />

            {/* 角色列表展示部分 */}
            <RoleList
                pageQueryRolesResp={pageQueryRolesResp}
                pageQueryParam={pageQueryParam}
                setPageQueryParam={setPageQueryParam}
                doPageQuerySysRoles={doPageQuerySysRoles}
                setRoleWriteModalParam={setRoleWriteModalParam}
                doDeleteRole={doDeleteRole}
            />

            {/* 角色写操作Modal */}
            <RoleWriteModal
                roleWriteModalParam={roleWriteModalParam}
                closeRoleWriteModal={closeRoleWriteModal}
                setRoleWriteModalParam={setRoleWriteModalParam}
                doAddOrEditRole={doAddOrEditRole}
            />

        </div>
    )
}
export default Role;